<template>
	<div class="news">
		<h2>新闻列表，下方一共有{{persons.length}}个人</h2>
		<button @click="handleClick">点我获取一条新闻</button>
		<ul>
			<li v-for="news in newsList" :key="news.id">
				{{news.title}}
			</li>
		</ul>
	</div>
</template>

<script>
import { mapState } from 'vuex'
	export default {
		name:'News',
		computed:{
			...mapState(['newsList','persons'])
		},
		methods: {
			handleClick(){
				this.$store.dispatch('getNews')
			}
		},
	}
</script>

<style scoped>
	.news{
		background-color: skyblue;
		padding: 20px;
	}
</style>